Accessibility + UX improvements across the UI#52
Merged
Conversation
|
@Aditya8369 is attempting to deploy a commit to the Om Roy's projects Team on Vercel. A member of the Team first needs to authorize it. |
Contributor
Author
|
@omroy07 can you give |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Implemented accessibility/UX improvements for quiz pages:
quiz/nlmquiz.html
Added “Skip to content” link.
landmark.Wrapped quiz in a
Added role="radiogroup" for the options container and aria-live region (#sr-status).
Added dialog semantics (role="dialog", aria-modal="true", aria-labelledby) for warning + submit popups.
Improved results section semantics (
quiz/nlmquiz.css
Added skip-link + .sr-only styles.
Added consistent visible focus styling via :focus-visible and .option:focus-visible / button:focus-visible.
Added mobile grid behavior and reduced-motion support.
quiz/nlmquiz.js
Added aria-live announcements for question text, selection, correct/incorrect feedback, and final score.
Added focus management:
Popup open focuses the primary button.
Popup close restores focus.
Results show focuses the results heading.
Improved radiogroup semantics by setting role="radio" and aria-checked on option buttons.
quiz/motionquiz.html
Added “Skip to content” link.
landmark, radiogroup semantics, and aria-live region.Added
Added dialog semantics for popups.
Improved results section semantics.
quiz/motionquiz.css
Added skip-link/sr-only styles and :focus-visible focus rings.
Added mobile + reduced-motion CSS.
quiz/motionquiz.js
Added aria-live announcements for question/selection/feedback/final score.
Added focus management for popups and results.
closes #48